$maxWidth: 540px;
$bodyWith: 750;

$bgColor: #f5f5f5;
$fontColor: #333;

@function trimUnit($val) {
    @return $val / ($val * 0 + 1);
}

@function px2percent($val, $base: $bodyWith) {
    @return trimUnit($val) / trimUnit($base) * 100%;
}

@function p2r($val) {
    $res: ();

    @for $i from 1 through length($val) {
        $item: nth($val, $i);

        @if type-of($value: $item) == "number" {
            $item: (trimUnit($item) / trimUnit($bodyWith) * 1rem);
        }

        $res: append($res, $item);
    }

    @return $res;
}

html {
    font-size: 100vw;
    @media screen and (min-width: $maxWidth) {
        font-size: $maxWidth;
    }
}

p {
    margin: 0;
    padding: 0;
}
html,
body {
    margin: auto;
    width: 100%;
    height: 100%;
    max-width: $maxWidth;
    background: #f4f4f4;
    font-family: Arial;
}
a {
    text-decoration: none;
}
ul,
li {
    list-style: none;
}
